<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>新建预约单</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="/plugins/layui/css/layui.css" media="all" />
	<style type="text/css">
		.layui-form{
			padding: 20px ;
		}
		.layui-form-item {
			width: 33.333%;
			float: left;
			margin-right: 0;
		}

		@media (max-width: 1240px) {
			.layui-form-item .layui-inline {
				width: 100%;
				float: none;
			}
		}
	</style>
</head>
<body class="childrenBody">
	<form class="layui-form layui-form-pane">
		<div class="layui-form-item">
			<label class="layui-form-label">客户</label>
			<div class="layui-input-inline">
				<select name="customerId" lay-verify="required" lay-filter="test" lay-search id="customerId">
				 	<option value="">--请选择客户--</option>
				</select>
			</div>
			 <div class="layui-form-mid layui-word-aux">请根据手机号码或姓名检索</div>
		</div>
		
		<div class="layui-form-item">
			<label class="layui-form-label">预约车辆</label>
			<div class="layui-input-block" >
				<select name="customerCarId" lay-verify="required" id="carInfoId">
				 	<option value="">--请选择车辆信息--</option>
				</select> 
			</div>
		</div>
		
		<div class="layui-form-item">
			<label class="layui-form-label">预约项目</label>
			<div class="layui-input-block">
				<select name="productId" lay-verify="required" id="productId"> 
				 	<option value="">--请选择预约项目--</option>
				</select> 
			</div>
		
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">预约日期</label>
			<div class="layui-input-block">
				<input type="text" id="test1"  class="layui-input" lay-verify="required" name="orderTime" placeholder="请选择预约日期">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">状态</label>
			<div class="layui-input-block">
			<!-- ,0预约中,-1取消,1开单,2结算 -->
				<select name="status" lay-verify="required" id="status"> 
				 	<option value="">--请选择状态--</option>
				 	<option value="0">待开单</option>
				 	<option value="1">已开单</option>
				 	<option value="-1">已取消</option>
				</select> 
			</div>
		
		</div>

		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-submit="" lay-filter="addSubscribes">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
		    </div>
		</div>
	</form>
	<script type="text/javascript" src="/js/jquery-1.11.2.min.js"></script>
	<script type="text/javascript" src="/plugins/layui/layui.js"></script>
	<script type="text/javascript">
	Date.prototype.Format = function (fmt) {  
	    var o = {  
	        "M+": this.getMonth() + 1, //月份  
	        "d+": this.getDate(), //日  
	        "h+": this.getHours(), //小时  
	        "m+": this.getMinutes(), //分  
	        "s+": this.getSeconds(), //秒  
	        "q+": Math.floor((this.getMonth() + 3) / 3), //季度  
	        "S": this.getMilliseconds() //毫秒  
	    };  
	    if (/(y+)/.test(fmt))  
	        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));  
	    for (var k in o)  
	        if (new RegExp("(" + k + ")").test(fmt))  
	            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));  
	    return fmt;  
	}  
	Date.prototype.addDays = function (d) {  
	    this.setDate(this.getDate() + d);  
	};  
	Date.prototype.addWeeks = function (w) {  
	    this.addDays(w * 7);  
	};  
	Date.prototype.addMonths = function (m) {  
	    var d = this.getDate();  
	    this.setMonth(this.getMonth() + m);  
	    if (this.getDate() < d)  
	        this.setDate(0);  
	};  
	Date.prototype.addYears = function (y) {  
	    var m = this.getMonth();  
	    this.setFullYear(this.getFullYear() + y);  
	    if (m < this.getMonth()) {  
	        this.setDate(0);  
	    }  
	}; 

 
	
	layui.config({
		base : "/js/admin/"
	}).extend({
	    $tool: 'tool'
	}).use(['form','layer','jquery','layedit','laydate','$tool'],function(){
		var form = layui.form,
			layer = parent.layer === undefined ? layui.layer : parent.layer,
			laydate = layui.laydate,
			$ = layui.jquery;
		   	$tool = layui.$tool;
		
			  var membersList;
			  $.ajax({
		          type : "GET",
		          url: '/storeMember/getAllStoreMembers',
		          dataType:'json',
		       	  async:false,
		          success: function(data){
		          	var list=data.data;
		          	membersList=list;
		          	var html='';
		              for(var i=0;i<list.length;i++){	
		                  html += "<option value='"+list[i].id+"'>"+list[i].phone+"   "+list[i].name+"</option>"
		              }
		              $("#customerId").append(html);
		              form.render();
		          }
		      }); 

			  var categorysList;
			  $.ajax({
		          type : "GET",
		          url: '/categorys/getAlls',
		          dataType:'json',
		       	  async:false,
		          success: function(data){
		        	var cateData=data.data;
		        	
		        	var html='';
		        	for(var i=0;i<cateData.length;i++){	
		        		html+='<option disabled="disabled">'+cateData[i].category.name+'</option>';
		        		var prosData=cateData[i].products;
		        	
		        			for(var j=0;j<prosData.length;j++){	
			        			html+='<option value="'+prosData[j].id+'" projectid="'+prosData[j].categoryId+'" price="'+prosData[j].price+'">|--'+prosData[j].name+'</option>';
			        		}
		        		
		        		
		        	}
		        	$("#productId").append(html);
		        	form.render(); 
		          }
		      }); 
			  form.on('select(test)', function(data){
				  if(data.value!=''){
					  $.ajax({
                          type : "GET",
                          url: '/storeMemberCar/getCarsByStoreMember/'+data.value,
				          dataType:'json',
				       	  async:false,
				          success: function(data){
				          	var list=data.data;
				          	membersList=list;
				          	var html='<option value="">--请选择车辆信息--</option>';
				              for(var i=0;i<list.length;i++){	
				                  html += "<option value='"+list[i].id+"'>"+list[i].plateNumber+"   "+list[i].carInfo+"</option>"
				              }
				              $("#carInfoId").html(html);
				              form.render();
				          }
				      });
				  }
	            	
	          }); 
		  
			  laydate.render({
			    elem: '#test1', //指定元素
			    min:0, type: 'datetime',
			    change: 
			    	function(value, date, endDate){

			    	}
			});
		//创建一个编辑器
	 	form.on("submit(addSubscribes)",function(data){
	 		var datas=data.field;
	 		var index = top.layer.msg('数据提交中，请稍候',{icon: 16,time:false,shade:0.8});
	 		$.ajax({  
	            type: "POST",  
	            url:"/subscribe/add",  
	            data:JSON.stringify(datas),// 序列化表单值  
	         //   dataType: "json",
	            contentType:"application/json",
	            success: function(data) { 
	            	if(data.code ==2000){
	            		 top.layer.close(index);
	            		 top.layer.msg("添加成功！");
	            		 layer.closeAll("iframe");
	            		 parent.location.reload();
	            	}else{
	            		top.layer.close(index);
	            		 top.layer.msg("添加失败！");
	            	}
	            } ,
		 		 error: function(request) {  
		             alert("Connection error");  
		         } 
	          
	        });
	 		  return false;
	 	})
		
	})
	</script>
</body>
</html>

